<template>
  <el-dialog :append-to-body="true" :visible.sync="dialog" :title.sync="title" width="940px">
    <el-form ref="form" :model="form" :rules="rules" size="small" label-width="125px">
      <el-row :gutter="24">
        <el-col :span="12">
          <el-form-item label="巡检类型" prop="typeid">
            <el-select v-model="form.typeid" placeholder="巡检类型" :disabled="isView" class="input_text" @change="indexSelect($event)">
              <el-option v-for="(item,index) in inspectionType" :key="index" :label="item.name" :value="item.value" />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="巡检对象" prop="objid">
            <el-select v-model="form.objid" placeholder="巡检对象" :disabled="isView" class="input_text">
              <el-option v-for="(itemobject,index) in inspectionObject" :key="index" :label="itemobject.label" :value="itemobject.id" />
            </el-select>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="24">
        <el-col :span="12">
          <el-form-item label="巡检项目" prop="itemname">
            <el-input v-model="form.itemname" :readonly="isView" class="input_text" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="巡检内容" prop="itemcontent">
            <el-input v-model="form.itemcontent" :readonly="isView" class="input_text" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="24">
        <el-col :span="12">
          <el-form-item label="合格标准" prop="itemstandard">
            <el-input v-model="form.itemstandard" :readonly="isView" class="input_text" />
          </el-form-item>
        </el-col>
      </el-row>
      <el-row :gutter="24">
        <el-col :span="24">
          <el-form-item label="备注">
            <el-input v-model="form.remark" :rows="4" :readonly="isView" style="width: 760px;" type="textarea" />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button v-show="isView===false || isAdd===true" type="text" @click="cancel">取消</el-button>
      <el-button v-show="isAdd===false && isView===true" :loading="loading" type="primary" @click="cancel">返回</el-button>
      <el-button v-show="isView===false" :loading="loading" type="primary" @click="doSubmit">确认</el-button>
    </div>
  </el-dialog>
</template>

<script>
import request from '@/utils/request'
import { add, edit } from '@/api/inspectionItem'
import { INSPECTION_TYPES } from '@/constants/consts'
export default {
  props: {
    isAdd: {
      type: Boolean,
      required: true
    },
    isView: {
      type: Boolean,
      required: true
    },
    supThis: {
      type: Object,
      default: null
    }
  },
  data() {
    return {
      loading: false,
      dialog: false,
      isShowSelect: false,
      title: '',
      form: {
        typename: '',
        objname: '',
        itemname: '',
        itemcontent: '',
        itemstandard: '',
        remark: ''
      },
      rules: {
        typeid: [{ required: true, trigger: 'blur', message: '巡检类型不能为空' }],
        objid: [{ required: true, trigger: 'blur', message: '巡检对象不能为空' }],
        itemname: [{ required: true, trigger: 'change', message: '巡检项目不能为空' }],
        itemcontent: [{ required: true, trigger: 'change', message: '巡检内容不能为空' }],
        itemstandard: [{ required: true, trigger: 'change', message: '合格标准不能为空' }]
      },
      dictId: 0,
      inspectionObject: [],
      inspectionType: INSPECTION_TYPES
    }
  },
  mounted: function() {
    this.title = this.isAdd ? '新增' : (this.isView === true ? '详情' : '编辑')
  },
  methods: {

    byNameinfo(name) {
      this.byName(name).then(res => {
        if (res.id) {
          this.bydictId(res.id).then(resobject => {
            this.inspectionObject = resobject
            this.form.objid = this.inspectionObject[0].id
          })
        }
      })
    },
    cancel() {
      this.resetForm()
    },
    doSubmit() {
      this.$refs['form'].validate(valid => {
        if (valid) {
          this.loading = true
          if (this.isAdd) {
            this.doAdd()
          } else this.doEdit()
        }
      })
    },
    doAdd() {
      add(this.form).then(res => {
        this.resetForm()
        this.$notify({
          title: '添加成功',
          type: 'success',
          duration: 2500
        })
        this.loading = false
        this.$parent.$parent.init()
      }).catch(err => {
        this.loading = false
        console.log(err)
      })
    },
    doEdit() {
      edit(this.form).then(res => {
        this.resetForm()
        this.$notify({
          title: '修改成功',
          type: 'success',
          duration: 2500
        })
        this.loading = false
        this.supThis.init()
      }).catch(err => {
        this.loading = false
        console.log(err)
      })
    },
    indexSelect(event) {
      if (event === 1) {
        this.byNameinfo('设备类巡检')
      } else if (event === 2) {
        this.byNameinfo('设施类巡检')
      } else if (event === 3) {
        this.byNameinfo('管理类巡检')
      }
    },
    // 获取id值
    byName(name) {
      return request({
        url: 'api/dict/byName/' + name,
        method: 'get'
      })
    },
    // 获取id值
    bydictId(id) {
      return request({
        url: 'api/dictDetail/findByDeptId/' + id,
        method: 'get'
      })
    },
    resetForm() {
      this.dialog = false
      this.$refs['form'].resetFields()
      this.form = {
        id: '',
        typeid: '',
        typename: '',
        objid: '',
        objname: '',
        itemname: '',
        itemcontent: '',
        itemstandard: '',
        remark: ''
      }
    }
  }
}
</script>

<style scoped>
.input_text {
  width: 300px;
}
</style>
